import './index.less';
let Item = React.createClass({


    render(){
        if (this.props.items) {
            return (
                <a href="javascript:void(0)"
                   className={'item ' + (this.props.active ? 'active' : '')}>
                    <i className={'fa fa-' + this.props.icon}></i>
                    <span> {this.props.label}</span>
                    <i className="fr fa fa-plus"></i>
                </a>
            );
        } else {
            return (
                <a href="javascript:void(0)"
                   className={'item ' + (this.props.active ? 'active' : '')}>
                    <i className={'fa fa-' + this.props.icon}></i>
                    <span> {this.props.label}</span>
                </a>
            );
        }

    }
})
export default class Nav extends React.PureComponent {
    constructor(props) {
        super(props)
    }

    render() {
        const Menus = [
            {
                label: '首页',
                icon: 'home',
                active: true,
            },
            {
                label: '发布新闻',
                icon: 'trello',
                items: [
                    {
                        label: '新闻列表'
                    },
                    {
                        label: '分类目录'
                    }
                ]
            },
            {
                label: '发布活动',
                icon: 'warning',
                items: [
                    {
                        label: '活动列表'
                    }
                ]
            },
            {
                label: '发布通知',
                icon: 'warning',
                items: [
                    {
                        label: '通知列表'
                    }
                ]
            },
            {
                label: '班级信息',
                icon: 'warning',
                items: [
                    {
                        label: '班级简介'
                    },
                    {
                        label: '班级荣誉'
                    },
                    {
                        label: '班级相册'
                    },
                    {
                        label: '任课老师'
                    },
                    {
                        label: '学生管理'
                    },
                ]
            },
            {
                label: '发布作业',
                icon: 'warning',
            },
            {
                label: '教学计划',
                icon: 'warning',
            },
            {
                label: '每日一新',
                icon: 'warning',
            },
            {
                label: '课程表',
                icon: 'warning',
            },
            {
                label: '模板管理',
                icon: 'warning',
            },
        ];
        return <div className="menu_left" style={{height: window.innerHeight}}>
            <div className="brand" style={{}}>
                <span>智能发布系统</span>
                <i style={{
                    position: 'relative',
                    top: '10px',
                    left: '3px',
                    fontSize: '23px'
                }} className="icon icon-frame"></i>
            </div>
            {Menus.map(function (item) {
                return <Item key={item.label}  {...item} />
            })}
        </div>
    }
}